<%@ include file="/WEB-INF/jsp/include.jsp" %>
<html>
<head>
	<title><fmt:message key="title"/></title>
	<link rel="stylesheet" type="text/css" href="../css/styles.css"/>
	<script src="../js/music.js" type="text/javascript"></script>
	<script src="../js/positioning.js" type="text/javascript"></script>
	<script src="../js/XMLHttpRequestHelper.js" type="text/javascript"></script>
	<script src="../js/wimpy.js" type="text/javascript"></script>
	<style type="text/css">
		.image {max-height: 150px; max-width: 300px;}
	</style>	

	<!--[if gte IE 5]>
		<style type="text/css">
			.image {
				height: expression(Math.min(parseInt(this.offsetWidth), 150 ) + "px"); 
				width: expression(Math.min(parseInt(this.offsetWidth), 300 ) + "px");
			}
		</style>
	<![endif]-->
</head>
<body>
	<div class="alphabetContainer" id="alphabetContainer">
		<c:forEach items="${alphabet}" var="letter">
			<a href="javascript:getArtistsByLetter('${letter}');">${letter}</a>
		</c:forEach>
	</div>
	<div class="searchContainer" id="searchContainer">
		<form>
			<input 
				class="artistSearch" 
				name="artistSearch"
				id="artistSearch"
				type="text" 
				onkeyup="getArtistsByName(this.value);"
				onFocus="artistSearchFocus(this);"
				value="Artist Search"
				autocomplete="off"/>
			<!--
			<input
				class="albumSearch"
				id="albumSearch"
				name="albumSearch" 
				type="text" 
				onkeyup="getAlbumsByName(this.value);"
				onFocus="albumSearchFocus(this);"
				value="Album Search"/>
			-->
		</form>			
	</div>
	<div class="artistSearchResults" id="artistSearchResults"></div>
	<div class="logoutContainer" id="logoutContainer">
		<a href="albumManagement.htm"><fmt:message key="album.management"/></a>
		<a href="logout.htm"><fmt:message key="logout"/></a></div>
	<div class="playContainer" id="playContainer">
		<script type="text/javascript">makeWimpyPlayer();</script>
	</div>
	<div class="artistContainer" id="artistContainer"></div>
	<div class="albumsContainer" id="albumsContainer"></div>
	<div class="albumContainer" id="albumContainer"></div>
</body>
</html>